<template>
    <a-modal v-model:visible="refIsVisible" title="Basic Modal" @ok="handleOk">
        <p>Some contents...</p>
        <p>Some contents...</p>
        <p>Some contents...</p>
    </a-modal>
    <!-- <div class="label-select">
        <slot></slot>
        <div class="label-style">{{labelName}}</div>
        <div class="select-style">
            <a-input v-model:value="refInputValue" :placeholder="placeholder" :style="'width:' + inputWidth +'px'"
                @change="handleChange" :disabled="isdisabled" />
        </div>
    </div> -->
</template>
<script lang="ts">
export default {
    name: 'ProjectModal'
}
</script>
<script lang="ts" setup>
import { computed, ref, toRaw, getCurrentInstance, watch, inject } from 'vue';

const modalVisable = inject('modalVisiableValue');

let props = defineProps({
    isVisible: Boolean,
    recordId: Number,
})

let refIsVisible = ref<boolean>(false);
watch(() => [props.isVisible], () => {
    refIsVisible.value = props.isVisible;
})


// let refInputValue = ref(props.inputValue);

// const emits = defineEmits(['update:inputValue'])

// watch(() => [props.inputValue], () => {
//     refInputValue.value = props.inputValue;
// })
// 需要传递的值
// const handleChange = (e: any) => {
//     emits('update:inputValue', refInputValue.value)
// }
setTimeout(() => {
    console.log('modalVisable的值', modalVisable);
}, 1000);
const handleOk = () => { }
</script>
<style lang="less" scoped>
.label-select {
    height: 32px; // 默认输入框高度为32px
    display: flex;
    align-items: center;

    .select-style {
        margin-left: 10px;
    }

    :deep(.ant-select-selector) {
        text-align: left;
    }
}
</style>